<div class="container-fluid" style="background-color: #f9f9f9;">
  <header
    class=" d-flex flex-wrap align-items-center justify-content-center justify-content-md-between py-3 mb-1 border-bottom pt-1 pb-1">
    <a href="/" class="d-flex align-items-center col-md-3 mb-2 mb-md-0 text-dark text-decoration-none fs-4">
      <img src="/static/img/logo/logo.png" width="180" alt="">
    </a>

    <ul class="nav col-12 col-md-auto mb-2 justify-content-center mb-md-0">
      <li><a href="/home/" class="nav-link px-2 link-secondary fs-6">主页</a></li>
      <li><a href="/all-0-0-0/" class="nav-link px-2 link-secondary fs-6">全部帖子</a></li>
      <li><a href="/publish/" class="nav-link px-2 link-secondary fs-6">发表帖子</a></li>
      <li><a href="/post/list/" class="nav-link px-2 link-secondary fs-6">全部文件</a></li>
      <li><a href="/post/new/" class="nav-link px-2 link-secondary fs-6">发文件</a></li>
      <li><a href="/chatroom/" class="nav-link px-2 link-secondary fs-6">单聊室</a></li>
      <li><a href="/multichat/" class="nav-link px-2 link-secondary fs-6">群聊室</a></li>
    </ul>

    <div class="col-md-3 text-end">

      {% if uid or user.is_authenticated %}
      <div class="flex-shrink-0 ">
        {% if uid %}
        <div class="avatar" id="dropdownUser2" data-bs-toggle="dropdown" aria-expanded="false">
          <a href="#" class="text-white" style="text-decoration: none;">
            <img class="avatar img-thumbnail" src="{{ uavatar }}" alt="{{ uid}}">
          </a>
        </div>
        {% else %}
        <div class="avatar" id="dropdownUser2" data-bs-toggle="dropdown" aria-expanded="false">
          <a href="#" class="text-white" style="text-decoration: none;">
            <img class="avatar img-thumbnail" src="{{ user.avatar.url}}" alt="{{ user.username}}">
            <!-- {{ user.username }} -->
          </a>
        </div>
        {% endif %}
        <ul class="dropdown-menu text-/all-0-0-0small shadow end-0 " style="width: 150px;" aria-labelledby="dropdownUser2">
          <li><a class="dropdown-item" href="/edit-pwd">修改密码</a></li>
          <li><a class="dropdown-item" href="/user-info/">个人中心</a></li>
          <li>
            <hr class="dropdown-divider">
          </li>
          <li><a class="dropdown-item" href="/logout">登出</a></li>
        </ul>
      </div>

      {% else %}
      <button type="button" class="btn btn-sm btn-outline-primary me-2"><a href="/login">登录</a></button>
      {% endif %}
    </div>
  </header>
  <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
  <script>
    $(document).ready(function () {
      $(".nav-link").hover(function(){
          $(this).addClass('text-dark fw-bold');
          $(this).removeClass('fs-6');
          $(this).addClass('fs-5')
      },function(){
          $(this).removeClass('text-dark fw-bold');
          $(this).removeClass('fs-5');
          $(this).addClass('fs-6')
      });
    });
  </script>
</div>